<form name="goodsForm" class="form-horizontal form-validation" ng-submit="addGoods()">
    <div class="panel">

        <!--基本信息-->
        <div class="m-b-sm">
            <div class="padder-md padder-v bg-light m-b-sm">
                <span class="font-bold">基本信息</span>
            </div>
            <div>
                <div class="form-horizontal form-validation">
                    <div class="form-group">
                        <label class="col-sm-1 control-label">商品名</label>
                        <div class="col-sm-4">
                            <input type="text" name="name" ng-model="goodsDetailAddService.goods.name" class="form-control m-b-xs" placeholder="请输入商品名" required>
                            <div ng-if="goodsForm.name.$touched">
                                <p ng-if="goodsForm.name.$error.required" class="text-danger h6">商品名是必需的</p>
                            </div>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-1 control-label">商品提示</label>
                        <div class="col-sm-4">
                            <input type="text" name="hint" ng-model="goodsDetailAddService.goods.hint" class="form-control m-b-xs" placeholder="请输入商品提示" required>
                            <div ng-if="goodsForm.hint.$touched">
                                <p ng-if="goodsForm.hint.$error.required" class="text-danger h6">商品提示是必需的</p>
                            </div>
                        </div>
                    </div>

                    <div class="form-group">
                        <label class="col-sm-1 control-label">系统分类</label>
                        <div class="col-sm-4">
                            <ui-select multiple
                                       ng-model="systemTypesArr"
                                       theme="bootstrap"
                                       ng-disabled="disabled"
                                       ng-click="changeSystemType($select.selected)"
                                    >
                                <ui-select-match placeholder="选择系统分类">{{$item.fullName}}</ui-select-match>
                                <ui-select-choices repeat="item in systemTypes | filter: $select.search"
                                                   refresh="refreshAddresses($select.search)"
                                                   refresh-delay="0">
                                    <div ng-bind-html="item.fullName | highlight: $select.search"></div>
                                </ui-select-choices>
                            </ui-select>
                        </div>
                    </div>

                    <div class="form-group">
                        <label class="col-sm-1 control-label">商品类别</label>
                        <div class="col-sm-4">
                            <select name="account" class="form-control" name="typeId" ng-model="goodsDetailAddService.goods.typeId" ng-options="item.id as item.fullName for item in types" required>
                                <option value="">请选择商品类别</option>
                            </select>
                            <div ng-if="goodsForm.typeId.$touched">
                                <p ng-if="goodsForm.typeId.$error.required" class="text-danger h6">商品类别是必需的</p>
                            </div>
                        </div>
                        <div class="col-sm-3 no-padder">
                            <div class="inline m-t-sm">
                                <a ui-sref="app.goodsTypes" target="_blank" class="text-info inline h6">新建</a>
                                <p class="inline h6">|</p>
                                <a class="text-info inline h6" ng-click="queryType()">刷新</a>
                            </div>
                        </div>
                    </div>

                    <div class="form-group">
                        <label class="col-sm-1 control-label">品牌类别</label>
                        <div class="col-sm-4">
                            <select name="account" class="form-control" name="brandId" ng-model="goodsDetailAddService.goods.brandId" ng-options="item.id as item.name for item in brands"  required>
                                <option value="">请选择品牌类别</option>
                            </select>
                            <div ng-if="goodsForm.brandId.$touched">
                                <p ng-if="goodsForm.brandId.$error.required" class="text-danger h6">品牌类别是必需的</p>
                            </div>
                        </div>
                        <div class="col-sm-3 no-padder">
                            <div class="inline m-t-sm">
                                <a ui-sref="app.brandAdd" target="_blank" class="text-info inline h6">新建</a>
                                <p class="inline h6">|</p>
                                <a class="text-info inline h6" ng-click="querybrands()">刷新</a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

        </div>

        <!--商品价格库存-->
        <div class="m-b-sm">
            <div class="padder-md padder-v bg-light m-b-sm">
                <span class="font-bold">商品价格/库存</span>
            </div>
            <div>
                <div class="form-horizontal form-validation">
                    <div class="form-group">
                        <label class="col-sm-1 control-label">商品单价</label>
                        <div class="col-sm-4">
                            <div class="input-group m-b-xs">
                                <span class="input-group-addon">¥</span>
                                <input type="text" class="form-control" name="price" placeholder="请输入单价 例如 9.99"  ng-model="goodsDetailAddService.goods.price" maxlength="8" ng-disabled="goodsDetailAddService.goods.isOpenSku==1" ng-pattern="/^([1-9][\d]*|0)(\.[\d]{1,2})?$/" required>
                            </div>
                            <div ng-if="goodsForm.price.$touched">
                                <p ng-if="goodsForm.price.$error.pattern" class="text-danger h6">请输入数字</p>
                                <p ng-if="goodsForm.price.$error.required" class="text-danger h6">单价是必需的</p>
                            </div>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-1 control-label">商品参考价</label>
                        <div class="col-sm-4">
                            <div class="input-group m-b-xs">
                                <span class="input-group-addon">¥</span>
                                <input type="text" class="form-control" name="referencePrice" placeholder="请输入参考价 例如 9.99" ng-model="goodsDetailAddService.goods.referencePrice" maxlength="8" ng-pattern="/^([1-9][\d]*|0)(\.[\d]{1,2})?$/" required>
                            </div>
                            <div ng-if="goodsForm.referencePrice.$touched">
                                <p ng-if="goodsForm.referencePrice.$error.pattern" class="text-danger h6">请输入数字</p>
                                <p ng-if="goodsForm.referencePrice.$error.required" class="text-danger h6">参考价是必需的</p>
                            </div>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-1 control-label">商品库存</label>
                        <div class="col-sm-4">
                            <input type="text" name="stock" class="form-control m-b-xs" ng-model="goodsDetailAddService.goods.stock" placeholder="请输入商品库存" maxlength="9" ng-disabled="goodsDetailAddService.goods.isOpenSku==1" ng-pattern="/^([1-9][\d]*|0)$/" required>
                            <div ng-if="goodsForm.stock.$touched">
                                <p ng-if="goodsForm.stock.$error.pattern" class="text-danger h6">请输入数字</p>
                                <p ng-if="goodsForm.stock.$error.required" class="text-danger h6">库存是必需的</p>
                            </div>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-1 control-label">餐盒费</label>
                        <div class="col-sm-4">
                            <input type="text" name="foodBoxCharge" class="form-control m-b-xs" ng-model="goodsDetailAddService.goods.foodBoxCharge" placeholder="请输入商品的餐盒费" maxlength="9" ng-pattern="/^[0-9]+(.[0-9]{1,2})?$/" required>
                            <div ng-if="goodsForm.foodBoxCharge.$touched">
                                <p ng-if="goodsForm.foodBoxCharge.$error.pattern" class="text-danger h6">请输入数字</p>
                                <p ng-if="goodsForm.foodBoxCharge.$error.required" class="text-danger h6">餐盒费是必需的</p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="m-b-sm" ng-if="(shop.isOpenSell==1 || shop.isOpenRebate==1) && shop.isPlatform==0">
            <div class="padder-md padder-v bg-light m-b-sm">
                <span class="font-bold">销售类型<i class="inline m-l-xs fa fa-question-circle text-muted pos-rlt h6"  popover-placement="top" popover="分销-参与商品分销返利,返利-商品参与全额返利" popover-trigger="mouseenter"></i></span>
            </div>
            <div>
                <div class="inline">

                    <div class="inline text-center m-r-xs fa-border pos-rlt" ng-class="{true:'selected-con-active'}[goodsDetailAddService.goods.isOpenSell ==0 && goodsDetailAddService.goods.isOpenRebate == 0]" ng-click="changeSellType(0)" ng-if="shop.isChain==1">
                        <div class="m-xs">
                            <p class="font-bold">普通商品</p>
                            <p class="h6">(不参与分销返利)</p>
                            <div class="tranangle-bar-con text-center">
                                <div class="tranangle-bar"></div>
                                <p class="fa fa-check tranangle-bar-text"></p>
                            </div>
                        </div>
                    </div>
                    <div class="inline text-center m-r-xs fa-border pos-rlt" ng-class="{true:'selected-con-active'}[goodsDetailAddService.goods.isOpenSell==1 && goodsDetailAddService.goods.isOpenRebate == 0]" ng-click="changeSellType(1)" ng-if="shop.isOpenSell==1">
                        <div class="m-xs">
                            <p class="font-bold">分销商品</p>
                            <p class="h6">(参与分销商品)</p>
                            <div class="tranangle-bar-con text-center">
                                <div class="tranangle-bar"></div>
                                <p class="fa fa-check tranangle-bar-text"></p>
                            </div>
                        </div>
                    </div>
                    <div class="inline text-center m-r-xs fa-border pos-rlt" ng-class="{true:'selected-con-active'}[goodsDetailAddService.goods.isOpenSell==0 && goodsDetailAddService.goods.isOpenRebate == 1]" ng-click="changeSellType(2)" ng-if="shop.isOpenRebate==1">
                        <div class="m-xs">
                            <p class="font-bold">返利商品</p>
                            <p class="h6">(参与返利商品)</p>
                            <div class="tranangle-bar-con text-center">
                                <div class="tranangle-bar"></div>
                                <p class="fa fa-check tranangle-bar-text"></p>
                            </div>
                        </div>
                    </div>
                    <div class="inline text-center m-r-xs fa-border pos-rlt" ng-class="{true:'selected-con-active'}[goodsDetailAddService.goods.isOpenSell==1 && goodsDetailAddService.goods.isOpenRebate == 1]" ng-click="changeSellType(3)" ng-if="shop.isOpenSell==1 && shop.isOpenRebate==1">
                        <div class="m-xs">
                            <p class="font-bold">爆款/分销</p>
                            <p class="h6">(参与分销返利)</p>
                            <div class="tranangle-bar-con text-center">
                                <div class="tranangle-bar"></div>
                                <p class="fa fa-check tranangle-bar-text"></p>
                            </div>
                        </div>
                    </div>

                </div>
            </div>
        </div>

        <!--商品分销让利值-->
        <div class="m-b-sm" ng-if="goodsDetailAddService.goods.isOpenSell ==1 || goodsDetailAddService.goods.isOpenRebate == 1">
            <div class="padder-md padder-v bg-light m-b-sm">
                <span class="font-bold">让利设置</span>
            </div>
            <div>
                <div class="form-horizontal form-validation">
                    <div class="form-group">
                        <label class="col-sm-1 control-label">PS值(让利值)</label>
                        <div class="col-sm-4">
                            <div class="input-group m-b-xs">
                                <input type="text" class="form-control" name="profit" placeholder="请输入PS值 (1~100)" ng-model="goodsDetailAddService.goods.profit" maxlength="8" ng-pattern="/^([1-9][\d]*|0)(\.[\d]{1,2})?$/" required>
                                <span class="input-group-addon">%</span>
                            </div>
                            <div ng-if="goodsForm.profit.$touched">
                                <p ng-if="goodsForm.profit.$error.required" class="text-danger h6">商品让利值是必需的</p>
                                <p ng-if="goodsForm.profit.$error.pattern" class="text-danger h6">请输入数字</p>
                                <p ng-if="goodsDetailAddService.goods.profit>100" class="text-danger h6">不能填写大于100的值 </p>
                                <p ng-if="(goodsDetailAddService.goods.isOpenRebate==1 && goodsDetailAddService.goods.profit<26)" class="text-danger h6">爆款返利商品的PS值必须大于26%</p>
                                <p ng-if="(goodsDetailAddService.goods.isOpenRebate==1 || goodsDetailAddService.goods.isOpenSell==1) && goodsDetailAddService.goods.profit<shop.profit"
                                   class="text-danger h6">您设置的PS值必须大于店铺的设置的默认返利值({{shop.profit}}%)</p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <!--规格设置-->
        <div class="m-b-sm" ng-show="goodsDetailAddService.goods.isOpenSku==1" ng-controller="GoodsSkuCtrl">
            <div class="padder-md padder-v bg-light m-b-sm">
                <span class="font-bold">规格设置</span>
            </div>
            <div>

                <div class="form-horizontal form-validation">
                    <div class="form-group">
                        <div class="block">
                            <label class="col-sm-1 control-label">商品规格</label>
                            <div class="col-sm-11">

                                <!--规格设置-->
                                <div class="panel-body fa-border">

                                    <!-- 规格 -->
                                    <div class="m-b-xs" ng-repeat="item in skus track by $index" ng-init="item.selectShow=false;item.isOpenImage=false;">

                                        <!--规格sku-->
                                        <div class="bg-light m-b-xs padder-v padder-md">
                                            <label class="inline h6 m-r-xs">规格名:</label>
                                            <div class="inline pos-rlt">
                                                <input type="text" maxlength="8" class="form-control inline w-xs" ng-click="$event.stopPropagation();" ng-model="item.name" ng-focus="skuFocus(item);" ng-blur="skuBlur(item)" required>
                                                <div class="select-sku-box" ng-show="item.selectShow">
                                                    <span ng-if="shopSkus.length<=0" class="block padder-v h6 padder-md">暂无规格名称可选</span>
                                                    <span class="padder-v h6 sku-item-hover" ng-repeat="sku in shopSkus" ng-click="selectSku(item,sku);$event.stopPropagation();">{{sku.name}}</span>
                                                </div>
                                            </div>
                                            <label class="i-checks i-checks-sm h6" ng-if="$index==0">
                                                <input type="checkbox" ng-checked="item.isOpenImage" ng-click="showIsOpenImage(item)"><i></i>
                                                添加规格图片
                                            </label>
                                            <div class="pull-right">
                                                <i class="fa fa-times cancel-tri-box m-t-sm" ng-click="delSku(item)"></i>
                                            </div>
                                        </div>

                                        <!--规格skuitems-->
                                        <div class="padder-v padder-md">
                                            <div class="inline">
                                                <span class="pull-left h6 m-r-xs m-t-sm">规格值:</span>
                                                <div class="pull-left">
                                                    <div class="pull-left pos-rlt sku-item-box m-r-sm m-b-sm"  ng-repeat="subItem in item.skuItems track by $index" ng-init="initSort(subItem,$parent.$index,$index);">
                                                        <div class="inline pos-rlt">
                                                            <input type="text" maxlength="8" class="form-control w-sm" ng-click="$event.stopPropagation();" ng-model="subItem.standard" ng-focus="skuItemsFocus(subItem,item)" ng-blur="skuItemsBlur(subItem,item)" required>
                                                            <div class="select-sku-box" ng-show="subItem.selectShow">
                                                                <span ng-if="subItem.selectSkuItems.length<=0" class="block padder-v h6 padder-md">暂无规格可选</span>
                                                                <span class="padder-v h6 sku-item-hover" ng-repeat="skuItems in subItem.selectSkuItems" ng-click="selectSkuItems(subItem,skuItems,$event)">{{skuItems.standard}}</span>
                                                            </div>
                                                        </div>
                                                        <div class="block standard-pic-box m-t-xs" ng-if="$parent.$index==0 && item.isOpenImage">
                                                            <uploadpic queue-limit="{{pictureLimit}}" path="{{path}}" images="headerImages" app="app" unique="subItem.image" del-func="delImage"></uploadpic>
                                                        </div>
                                                        <div class="cancel-box fa fa-times" ng-click="delSkuItems(subItem,item)"></div>
                                                    </div>
                                                    <div class="pull-left m-t-xs">
                                                        <a class="h6 text-info" ng-click="addSkuItemsContainer(item)">添加规格项目</a>
                                                    </div>
                                                    <div class="m-t-lg block" ng-if="$index==0 && item.isOpenImage">
                                                        <label class="h6 text-muted">仅支持为第一组规格设置规格图片（最多20张图），买家选择不同规格会看到对应规格图片，建议尺寸：400 x 400像素</label>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>

                                    </div>

                                    <div class="padder-v bg-light padder">
                                        <div class="btn btn-default btn-sm" ng-click="addSkuContainer()" ng-disabled="index>=3">添加规格项目</div>
                                        <i class="m-l-xs fa fa-question-circle text-muted pos-rlt h6" popover-placement="top" popover="规格名至多添加3个" popover-trigger="mouseenter">
                                        </i>
                                    </div>


                                </div>


                                <!--规格明细 -->
                                <div class="panel-body m-t-sm fa-border bg-light" ng-if="skus.length>0">
                                    <div class="panel-body bg-white">
                                        <table class="table table-bordered  table-striped m-n">
                                            <thead>
                                            <tr>
                                                <th ng-repeat="item in skus">{{item.name}}</th>
                                                <th width="60" ng-if="skus[0].isOpenImage">图片</th>
                                                <th>*价格（元）</th>
                                                <th>*库存</th>
                                                <th>操作</th>
                                            </tr>
                                            </thead>
                                            <tbody>
                                            <tr ng-repeat="item in skuContents" ng-init="item.price=0;item.stock=0">
                                                <td rowspan="1" ng-repeat="subItem in item.goodsSkuItems track by $index">{{subItem}}</td>
                                                <td ng-if="skus[0].isOpenImage"><div class="thumb-sm"><img ng-src="{{app.image.goodsSku}}{{item.pic}}" err-src="img/error.png" style="width: 40px;height: 40px;"/> </div></td>
                                                <td><input type="text" class="w-xs form-control" ng-model="item.price" ng-required="item.price>0.01" maxlength="8" ng-pattern="/^([1-9][\d]*|0)(\.[\d]{1,2})?$/"></td>
                                                <td><input type="text" class="w-xs form-control" ng-model="item.stock" ng-required="item.stock>1" maxlength="8" ng-pattern="/^([1-9][\d]*|0)$/"></td>
                                                <td>
                                                    <div class="inline">
                                                        <label class="i-switch m-t-xs m-r-xs pull-left">
                                                            <input type="checkbox" ng-model="item.status" ng-checked="item.status==1" ng-true-value="1" ng-false-value="0">
                                                            <i></i>
                                                        </label>
                                                        <p class="pull-left h6 m-t-sm" ng-bind="{0:'下架',1:'上架'}[item.status]">--</p>
                                                    </div>
                                                </td>
                                            </tr>
                                            </tbody>

                                        </table>
                                    </div>
                                    <div class="panel-body bg-white">
                                        <span class="inline h6">批量设置:</span>
                                        <div class="inline">
                                            <div class="inline m-r">
                                                <span class="inline h6 m-r-xs">价格设置</span>
                                                <input type="text" name="unifiedPrice" ng-model="unifiedPrice" class="w-xs form-control inline h6" placeholder="统一价格" maxlength="9" ng-pattern="/^([1-9][\d]*|0)(\.[\d]{1,2})?$/">
                                            </div>
                                            <div class="inline btn btn-success btn-sm m-r" ng-click="saveSkuPrice(unifiedPrice)">设置</div>
                                            <div class="inline m-r">
                                                <span class="inline h6 m-r-xs">库存设置</span>
                                                <input type="text" name="unifiedStock" ng-model="unifiedStock" class="w-xs form-control inline h6" placeholder="统一库存" maxlength="9" ng-pattern="/^([1-9][\d]*|0)$/">
                                            </div>
                                            <div class="inline btn btn-success btn-sm" ng-click="saveSkuStock(unifiedStock)">设置</div>
                                        </div>
                                    </div>
                                </div>

                                <div class="m-t" ng-if="skus.length==0">
                                    <span class="block text-danger h6">* 开启规格设置,规格名称和规格值至少存在一个</span>
                                </div>
                            </div>
                        </div>

                    </div>

                </div>

            </div>
        </div>

        <!--商品上架设置-->
        <div class="m-b-sm" ng-if="shop.isPlatform==1">
            <div class="padder-md padder-v bg-light m-b-sm">
                <span class="font-bold">商品上架</span>
            </div>
            <div>

                <div class="form-horizontal form-validation" ng-init="goodsDetailAddService.goods.status=1">
                    <div class="form-group">
                        <div class="block">
                            <label class="col-sm-1 control-label">上架设置</label>
                            <div class="col-sm-4">

                                <div class="m-b-sm">
                                    <div class="m-b-sm">
                                        <div class="radio inline">
                                            <label class="i-checks i-checks-sm">
                                                <input type="radio" name="status" ng-model="goodsDetailAddService.goods.status"  value="1" required  class="ng-pristine ng-untouched ng-valid ng-valid-required">
                                                <i></i>
                                            </label>
                                        </div>
                                        <p class="inline m-n">立即上架售卖</p>
                                    </div>
                                </div>

                                <div class="m-b-sm">
                                    <div class="m-b-sm">
                                        <div class="radio inline">
                                            <label class="i-checks i-checks-sm">
                                                <input type="radio" name="status" ng-model="goodsDetailAddService.goods.status" value="0" required  class="ng-pristine ng-untouched ng-valid ng-valid-required">
                                                <i></i>
                                            </label>
                                        </div>
                                        <p class="inline m-n">暂不售卖，放入仓库</p>
                                    </div>
                                </div>

                            </div>
                        </div>

                    </div>

                </div>

            </div>

        </div>

        <!--其他设置-->
        <div class="m-b-sm">
            <div class="padder-md padder-v bg-light m-b-sm">
                <span class="font-bold">其他设置</span>
            </div>
            <div>
                <div class="form-group">
                    <label class="col-sm-1 control-label">规格设置</label>
                    <div class="col-sm-4">
                        <div class="pull-left">
                            <label class="i-switch m-t-xs m-r">
                                <input type="checkbox" ng-model="goodsDetailAddService.goods.isOpenSku" ng-true-value="1" ng-false-value="0" ng-click="openSku()">
                                <i></i>
                            </label>
                        </div>
                        <label class="pull-left m-t-xs m-r" ng-bind="{1:'已开启',0:'未开启'}[goodsDetailAddService.goods.isOpenSku]"></label>
                        <i class="m-t-sm pull-left m-l-xs fa fa-question-circle text-muted pos-rlt h6"  popover-placement="top" popover="商品是否做规格组合选择" popover-trigger="mouseenter"></i>
                    </div>
                </div>
                <div class="form-group">
                    <label class="col-sm-1 control-label">是否推荐</label>
                    <div class="col-sm-4">
                        <div class="pull-left">
                            <label class="i-switch m-t-xs m-r">
                                <input type="checkbox" ng-model="goodsDetailAddService.goods.isRecommend" ng-true-value="1" ng-false-value="0">
                                <i></i>
                            </label>
                        </div>
                        <label class="pull-left m-t-xs m-r" ng-bind="{1:'已推荐',0:'不推荐'}[goodsDetailAddService.goods.isRecommend]"></label>
                        <i class="m-t-sm pull-left m-l-xs fa fa-question-circle text-muted pos-rlt h6"  popover-placement="top" popover="商品是否作为推荐" popover-trigger="mouseenter"></i>
                    </div>
                </div>
                <div class="form-group">
                    <label class="col-sm-1 control-label">是否开启扶农</label>
                    <div class="col-sm-4">
                        <div class="pull-left">
                            <label class="i-switch m-t-xs m-r">
                                <input type="checkbox" ng-model="goodsDetailAddService.goods.isHelpPeasant" ng-true-value="1" ng-false-value="0">
                                <i></i>
                            </label>
                        </div>
                        <label class="pull-left m-t-xs m-r" ng-bind="{1:'已开启',0:'未开启'}[goodsDetailAddService.goods.isHelpPeasant]"></label>
                        <i class="m-t-sm pull-left m-l-xs fa fa-question-circle text-muted pos-rlt h6"  popover-placement="top" popover="商品是否作为扶农产品" popover-trigger="mouseenter"></i>
                    </div>
                </div>
            </div>
        </div>

        <div class="b-t">
            <div class="col-sm-4 padder-v col-sm-offset-2">
                <button type="submit" class="btn btn-success"  ng-disabled="goodsForm.$invalid ||
                (goodsDetailAddService.goods.isOpenRebate==1 && goodsDetailAddService.goods.profit<26) ||
                (goodsDetailAddService.goods.isOpenSell==1 && goodsDetailAddService.goods.profit<shop.profit) ||
                goodsDetailAddService.goods.profit>100" ng-if="!addState">下一步</button>
                <div class="btn btn-success" ng-if="addState" disabled>保存中..</div>
            </div>
        </div>
    </div>
</form>